<!DOCTYPE html>
<html>
	<head>
		<meta charset="UTF-8">
		<meta name="viewport" content="width=device-width,initial-scale=1,minimum-scale=1,maximum-scale=1,user-scalable=no" />
		<title>new webview</title>
		
		<link href="../css/mui.min.css" rel="stylesheet" />
		<style type="text/css">
			
			.main{
				display: flex;
				justify-content: center;
				align-items: center;
				flex-direction: column;
				margin: 0.5em auto;
				width: 96%;
				overflow: hidden;
				background-color: white;
				border-radius: 0.2em;
			}
			.himg{
				width: 2.5em;
				height: 2.5em;
			}
			.himg img{
				width: 2.5em;
				height: 2.5em;
				border:1px solid #ccc;
				border-radius: 50%;
				position:relative;
				top: -2.5em;
			}
			.m-himg{
				width: 100%;
				display: flex;
				align-items: center;
				justify-content: space-between;
				padding: 10px;
				border-bottom: 1px solid #F4F4F4;
				overflow: hidden;
				color: #666666;
			}
			.himg input{
				position:relative;
			    opacity: 0;
			    display: block;
			    height: 100%;
			    width: 100%;
			    z-index: 9;
			}
			.htext{
				height: 2em;
				line-height: 2em;
			}
			.hbg{
				background-color: #7DB1FD;
			}
			.hbg a,.hbg h1{
				color: white;
			}
			.mui-content{
				min-height: 100vh;
				background-color: #E7EFFE;
			}
		</style>
	</head>
	<body>
		<header class="mui-bar mui-bar-nav hbg">
			<a class="mui-action-back mui-icon mui-icon-left-nav mui-pull-left"></a>
			<h1 class="mui-title hbg">编辑个人资料</h1>
		</header>
		
		<div class="mui-content">
			
			<div class="main" id="app">
				
				<div class="m-himg">
					更改头像
					<div class="himg">
						<input id="fileBtn" type="file" onchange="selectimg(this);" accept="image/*" capture="camera"/>
						<img src="../images/user-photo.png" id="himg" />
					</div>
				</div>
				<div class="m-himg" onclick="setname()">
					更改昵称
					<div class="htext" id="nc">
						
					</div>
				</div>
				<div class="m-himg" onclick="setdata()">
					编辑个人资料
					<div class="htext">
						
					</div>
				</div>
				
			</div>
			<div class="main" id="app">
			<div class="m-himg" onclick="setpsword()">
					重置密码
					<div class="htext">
					</div>
				</div>
			</div>
			
		</div>
		<script src="../js/jquery.min.js" type="text/javascript" charset="utf-8"></script>
		<script src="../js/req.js" type="text/javascript" charset="utf-8"></script>
		<script src="../js/mui.min.js"></script>
		<script src="../js/muishow.js" type="text/javascript" charset="utf-8"></script>
		<script src="../js/camera.js" type="text/javascript" charset="utf-8"></script>
		<script>
			var introduction = "";
			$(function(){
				getname();
          
				
			})
			function getname(){
				let data = {
					url:"/api/Personal/member_info",
					data:{access_token : acctoken()||""}
				};
				ajax(data,function(res){
					console.log(res);
					if(res.code == -1){
						mui.toast(res.message);
					}
					if(res.code == 1){
						let nc = document.getElementById("nc");
						let himg = document.getElementById("himg");
						nc.innerHTML = res.data[0].nickname;
						himg.src = res.data[0].headimage;
						introduction = res.data[0].introduction;
					}
				})
				
			}
			
		function selectimg(file) {  
        //文件为空，返回  
        if (!file.files || !file.files[0]) {  
            return;  
        }  
        var reader = new FileReader();  
        reader.onload = function(evt) {  
            var replaceSrc = evt.target.result;  
            // 更换cropper的图片  
            //$('#tailoringImg').cropper('replace', replaceSrc, false);// 默认false，适应高度，不失真  
            cutimage(replaceSrc);
            
        }  
        reader.readAsDataURL(file.files[0]);  
    }  
    
         //更换头像
                function updateheadimg(e) {
                	var imgurl = e.detail.img;
                	getBase64Image(imgurl,function(res){
                		console.log("图片压缩成功");
                		console.log(res.dataURL);
                		console.log(res.dataURL.length);
                		let data = {
                		url:'/api/Image/upload',
                		data:{
                			access_token:acctoken(),
                			image:res.dataURL
                		}
                	}
                	ajaxbase64(data,function(res){
                		console.log(res);
                		console.log("上传base64成功");
                		let data = {
							url:"/api/Personal/update_member",
							data:{
								access_token : acctoken()||"",
								nickname : "",
								introduction : "",
								mid :res.data[0].mid
							}
						}
						ajax(data,function(res1){
							mui.hideLoading();
	                        console.log(res1);
	                        if(res1.code == 1){
	                        	mui.toast("修改成功！");
	                        	getname();
	                        }
	                        if(res1.code == -1){
	                        	mui.toast(res1.message);
	                        }
						})
                		
                		
                	})
                	})
                	
                	
                }
             window.addEventListener("updatehimg", updateheadimg); //添加自定义事件，其他页面调用
      function cutimage(path) {
            	console.log(path);
            		let list = {
            			 path: path,
                         bmtype:1,
                         pageid:"setname",
                         width:w*2,
                         height:(w*z),
                         returnfun:"updatehimg"
            		}
                    mui.openWindow({
                        url: '../write_together/cropper.html',
                        id: 'cropper',
                        extras: list,
                        show: {
                            aniShow: 'zoom-fade-in',
                            duration: 800
                        },
                        waiting: {
                            autoShow: true
                        }
                    });
                }
			function img(c, d){
		    let $c = document.querySelector(c),
		        $d = document.querySelector(d),
		        file = $c.files[0];
				console.log("文件：",file);
				mui.showLoading("正在加载..","div");	
				upladfile(file,function(res){
					mui.hideLoading();
					console.log("上传图片返回的数据",res);
					if(res.code == 1){
						mui.toast("图片上传成功");
						let data = {
							url:"/api/Personal/update_member",
							data:{
								access_token : acctoken()||"",
								nickname : "",
								introduction : "",
								mid :res.data[0].mid
							}
						}
						ajax(data,function(res1){
							mui.hideLoading();
	                        console.log(res1);
	                        if(res1.code == 1){
	                        	mui.toast("修改成功！");
	                        	getname();
	                        }
	                        if(res1.code == -1){
	                        	mui.toast(res1.message);
	                        }
						})
					}
				})
			};

			function update(res){
				let data = {
					url:"/api/Personal/update_member",
					data:{
						access_token : acctoken()||"",
						nickname : res.nickname||"",
						introduction : res.introduction||"",
						mid : ""
					}
				}
				console.log(data);
				ajax(data,function(res){
					console.log(res);
					if(res.code == -1){
						mui.toast(res.message);
					}
					if(res.code == 1){
						mui.toast("修改成功")
						getname();
					}
				})
			}


			function setname(){
				 var btnArray = ['取消', '确定'];
                mui.prompt('请输入新昵称：', '', '', btnArray, function(e) {
                    if (e.index == 1) {
                        console.log("确定");
                        let	data = {
						nickname :e.value
						};
						update(data)
                    } else {
                        console.log("取消")
                    }
                })
               
			}
			function setdata(){
				mui.openWindow({
				    url: 'setdata.html?del='+introduction, 
				    id:'setdata',
				     show:{
				      autoShow:true,//页面loaded事件发生后自动显示，默认为true
				      aniShow:'slide-in-right',//页面显示动画，默认为”slide-in-right“；
                      duration:'300'
				    	},
					});
				}
			
			function setpsword(){
				mui.openWindow({
				    url: 'setpsword.html', 
				    id:'setpsword',
				     show:{
					    autoShow:true,//页面loaded事件发生后自动显示，默认为true
					    aniShow:'slide-in-right',//页面显示动画，默认为”slide-in-right“；
                      	duration:'300'
					    },
				 });
				}
			
			
		</script>
	</body>
</html>
